<!--
  Generated template for the EcardlistPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar text-center>
    <ion-title>名片浏览</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <ion-grid  mode="ios" no-padding style="background-color: #488aff">
    <ion-row style="margin-bottom: 2px">
      <ion-col col-10 no-padding align-self-center>
        <ion-input [(ngModel)]="searchtext" clearInput='true' style="float: right;width: 95%;background-color: white;padding-left:10px;"
          type="text" placeholder="搜索"></ion-input>
      </ion-col>
      <ion-col col-2 no-padding style="text-align: center;">
        <button ion-button icon-only style="background-color: #488aff;" (click)="getcardList()">
          <ion-icon name="search"></ion-icon>
        </button>
      </ion-col>
    </ion-row>
  </ion-grid>
  <div style="height: 10px;"></div>
  <div *ngFor="let card of ecardList">
    <ion-card>
      <ion-card-header>
        {{card.name}}
        <ion-icon *ngIf="card.fav==null" style="float: right;" color="primary" name="ios-star-outline" (click)="favOrUnfav(card)"></ion-icon>
        <ion-icon *ngIf="card.fav!=null" style="float: right;" color="yellow" name="star" (click)="favOrUnfav(card)"></ion-icon>
      </ion-card-header>
      <ion-list>
        <ion-item>
          <ion-icon name="logo-buffer" item-start></ion-icon>
          {{card.nj}}
        </ion-item>

        <ion-item>
          <ion-icon name="ribbon" item-start></ion-icon>
          {{card.zy}}
        </ion-item>

        <ion-item>
          <ion-icon name="mail" item-start></ion-icon>
          {{card.email}}
        </ion-item>

        <ion-item>
          <ion-icon name="call" item-start></ion-icon>
          {{card.phone}}
        </ion-item>

        <ion-item>
          <div style="float: left;">个人描述</div>
          <div style="float:right;">编号:{{card.no}}</div>
        </ion-item>
        <ion-textarea readonly="true" [value]="card.des" cols="30" rows="10" style="border: solid 1px #999">
        </ion-textarea>
      </ion-list>
    </ion-card>
  </div>
  <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>
</ion-content>